<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <!--
提交请求：
携带的参数
key: 控件的name。这个属性不要忘记

get：携带参数，参数可以在url中看到，不安全，大小有限
    https://www.baidu.com/?username=kuangshen&password=123456

post：参数不可见、安全，大小没有限制  （表单提交常用方式post）

-->

<!--form 表单
action： 提交地址
method：提交的方式
-->
    

    <!--输入框
        input 标签
            name： 必须写上
            type：
                text ： 文本框
                password： 密码框
                submit： 提交按钮
                reset： 重置
    -->
    <form action="first_test.html" method="get">
        <p>名字： <input type="text" name="username"></p>
        <p>密码：<input type="password" name="panssword"></p>
        <p>
            <input type="submit" value="提交">
            <input type="reset" value="重置">
        </p>




    </form>
<hr>

<form action="first_test.html" method="get">
    <p>
        <input type="text" name="username" value="用户名" size="30px" maxlength="8">用户名
    </p>

    <!--单选框Group  type="radio"
    -->

    <!--单选框type="radio"
        value： 表单提交的值
        name： 名字相同，则自动分组，必须要分组
        checked： 默认选中
        disabled： 禁用
        注意事项：默认没有值，需要再input type="radio" 后增加单选框的属性
    -->
    <p>
        <input type="radio" value="nan" name="sex" checked> 男
        <input type="radio" value="nv" name="sex" disabled>女
        <input type="radio" value="renyao" name="sex" >其他
    </p>
    <p>

    </p>

    <p>
        <!--按钮
             value：按钮上的文字
        -->
        <input type="submit" value="提交">提交
        <input type="reset" value="重置">重置

        <input type="button" value="按钮经典与js交互">
        <!-- 图片按钮 -->
        <input type="image" src="../image/123.jpg" width="100px" height="100px" value="图片">
    </p>

    <p>
        <!-- 文本雨，输入一段文本 -->
        <textarea name="text" id="text" cols="30" rows="10"></textarea>

        邮箱：<input type="email" name="email">
        uil <input type="url" name="url" id="111">
        数字输入<input type="number" name="number" id="number">
        滑块：<input type="range" name="range" id="range">
        搜索框：<input type="search" name="search" id="search">
    </p>

    


</form>

<form action="first_test.html" enctype="multipart/form-data">
    <!--
表单，需要支持提交复杂文件  enctype="multipart/form-data"
未来：文件上传会用到
-->
<p>
    <input type="file" name="video" id="1112">
    
</p>

<input type="submit" id="" value="上传">
</form>


</body>
</html>